.jui {
	.paging {
		display: block;
		width: 100%;
		
		* {
			position: absolute !important;
			display: inline-block;
		 	font-size: 12px;
			text-align: center;
			padding: 0px !important;
			text-decoration: none;
		    .box-sizing(border-box);
		}
		
		> .list {
			left: 94px;
			right: 92px;
			
			> * {
				position: relative !important;
				border-top-width: 0;
				border-bottom-width: 0;
				margin: -3px 0 0 -5px;
				.border-radius(0px);
			}
		}
		
		> .prev, > .next {
			width: 94px;
		}
		
		> .prev {
			text-align: right;
			padding-right: 13px !important;
      background-repeat: no-repeat;
      background-image: url("@{paging-list}");
		}
		
		> .next {
			text-align: left;
			padding-left: 12px !important;
			right: 0;
      background-repeat: no-repeat;
      background-image: url("@{paging-list}");
		}
		
		.paging-normal;
		.paging-white;
	}
	
	// PAGING SIZES
	// -----------
  	
	.paging-normal {
		.paging-size(28px);
		
		> .prev {
			background-position: 0 -28px;
		}

		> .next {
			background-position: 0 0;
		}
	}
  	
	.paging-large {
		.paging-size(38px);

		> .prev {
			background-position: 0 -23px;
		}

		> .next {
			background-position: 0 5px;
		}
	}
	
	.paging-size(@size) {
		height: @size;
		
		* {
			height: @size;
			line-height: @size;
		}
		
		.list > * {
			width: @size;
			height: @size - 2;
		}
	}
	
	// PAGING COLORS
	// -----------
  	
	.paging-white {
		* {
			background-color: #f7f7f7;
			border: 1px solid #e5e5e5;
			color: #333;
		}
		
		.list > * {
			&:hover {
				background-color: #f1f1f1;
			}
			
			&.active {
				background-color: #fff;
				color: #6600cc;
				cursor: default;
			}
		}
	}
}
